<template>
  <div>
    <ZgDialog
      width="40%"
      title="创建空间"
      v-model="visible"
      @ok="save">
      <a-form class="form" :labelCol="{ span: 4 }" :wrapperCol="{ span: 18 }">
        <a-form-item>
          <template slot="label">空间名称</template>
          <ZgTags v-model="nameArr"></ZgTags>
        </a-form-item>
        <a-form-item>
          <template slot="label">空间容量</template>
          <ZgNumber :width="120" v-model="obj.capacity"></ZgNumber>&nbsp;MB
        </a-form-item>
        <a-form-item>
          <template slot="label">数据类型</template>
          <ZgSelect :width="120" v-model="obj.dataType" :options="[{ value: '1', label: '表单' }, { value: '2', label: '文件' }]"></ZgSelect>
        </a-form-item>
        <a-form-item v-show="obj.dataType==='1'">
          <template slot="label">选择表单</template>
          <ZgInput :width="120" v-model="obj.formCode" placeholder="输入表单编码"></ZgInput>
        </a-form-item>
        <a-form-item v-show="obj.dataType==='2'">
          <template slot="label">文件类型</template>
          <ZgTags v-model="typeArr"></ZgTags>
        </a-form-item>
        <a-form-item v-show="obj.dataType==='2'">
          <template slot="label">大小限制</template>
          <ZgNumber :width="120" v-model="obj.fileMaxSize"></ZgNumber>&nbsp;MB
        </a-form-item>
      </a-form>
    </ZgDialog>
  </div>
</template>
<script>
export default {
  data () {
    return {
      visible: false,
      nameArr: [],
      typeArr: [],
      obj: {
        name: '',
        capacity: 50,
        dataType: '1',
        formCode: '',
        fileType: '',
        fileMaxSize: 10
      }
    }
  },
  methods: {
    open () {
      this.visible = true
    },
    save () {
      if (this.nameArr.length === 0) {
        this.$warning({ title: '请输入空间名称' })
        return
      }
      if (this.obj.capactity === 0) {
        this.$warning({ title: '请设置空间容量' })
        return
      }
      if (this.obj.dataType.length === 0) {
        this.$warning({ title: '请设置空间的数据类型' })
        return
      }
      if (this.obj.dataType === '1' && this.obj.formCode.length === 0) {
        this.$warning({ title: '请设置表单' })
        return
      }
      if (this.obj.dataType === '2') {
        if (this.typeArr.length === 0) {
          this.$warning({ title: '请设置文件类型' })
          return
        }
        if (this.obj.fileMaxSize === 0) {
          this.$warning({ title: '请设置单文件大小限制' })
          return
        }
      }
      this.obj.name = this.nameArr.join(',')
      this.obj.dataType = this.typeArr.join(',')
      this.$http.post('', this.obj, () => {
        this.visible = false
        this.$emit('ok')
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
